<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title>商品列表</title>
    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link href="../css/mui.min.css" rel="stylesheet"/>
    <link href="../phoneCss/commons.css" rel="stylesheet"/>
    <link href="../phoneCss/goods_list.css?r=1" rel="stylesheet"/>
    <style>
        .mui-content{
            padding-bottom: 0;
        }
        .mui-content-padded{
            margin: 0;
        }
        #offCanvasBtn{
            position: relative;
            z-index: 99999;
        }
        .mui-off-canvas-right{
            width: 88%;
            background: #fff;
        }
        .content{
            margin-bottom: 50px;
        }
        .mui-scroll{
            min-height: 100%;
        }
    </style>
</head>

<body>

<!--侧滑菜单容器-->
<!--<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable">-->
    <!--菜单部分-->
    <!--<aside id="offCanvasSide" class="mui-off-canvas-right">-->
        <!--<div id="offCanvasSideScroll" class="mui-scroll-wrapper">-->
            <!--<div class="mui-scroll">-->
                <!--<div class="content">-->
                    <!--<h2 class="price_area_title">价格区间</h2>-->
                    <!--<div class="price_box mui-clearfix">-->
                        <!--<p class="act"><input type="text" class="small_price" value="2000"></p>-->
                        <!--<span>—</span>-->
                        <!--<p><input type="text" class="add_price" value="最高价"></p>-->
                    <!--</div>-->
                    <!--<h2 class="brand_title universal_title">品牌</h2>-->
                    <!--<div class="brand_box universal_box mui-clearfix">-->
                        <!--<div>品牌品牌品牌品牌品牌品牌</div><div>品牌</div><div>品牌</div>-->
                        <!--<div>品牌</div><div>品牌</div><div>品牌</div>-->
                    <!--</div>-->
                    <!--<h2 class="online_title universal_title">网络制式</h2>-->
                    <!--<div class="universal_box mui-clearfix">-->
                        <!--<div>网络制式</div><div>网络制式</div><div>网络制式</div>-->
                    <!--</div>-->
                    <!--<h2 class="online_title universal_title">指纹识别</h2>-->
                    <!--<div class="universal_box mui-clearfix">-->
                        <!--<div>网络制式</div><div>网络制式</div><div>产品</div>-->
                    <!--</div>-->
                    <!--<h2 class="online_title universal_title">产品特点</h2>-->
                    <!--<div class="universal_box mui-clearfix">-->
                        <!--<div>后置双摄</div><div>后置双摄</div><div>后置双摄</div>-->
                    <!--</div>-->
                    <!--<h2 class="online_title universal_title">屏幕范围</h2>-->
                    <!--<div class="universal_box mui-clearfix">-->
                        <!--<div>5.6寸及以上</div><div>5.6寸及以上</div><div>5.6寸及以上</div>-->
                    <!--</div>-->
                    <!--<h2 class="online_title universal_title">SIM卡规格</h2>-->
                    <!--<div class="universal_box mui-clearfix">-->
                        <!--<div>标准SIM卡</div><div>标准SIM双卡</div>-->
                    <!--</div>-->

                <!--</div>-->
            <!--</div>-->
            <!--<div class="reset_box">-->
                <!--<div class="reset">重置</div>-->
                <!--<div class="certain" id="offCanvasHide" >确定</div>-->
            <!--</div>-->
        <!--</div>-->
    <!--</aside>-->
<!--主页面容器 -->
    <div class="mui-inner-wrap">
        <header class="mui-bar mui-bar-nav">
            <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
            <h1 class="mui-title"><input class="index-input" type="text" placeholder="搜索您想要的商品" autofocus="autofocus"
                                         id="keyword" readonly>
            </h1>
            <a class="mui-pull-right" id="search-right" list="2"></a>
        </header>
        <div class="swiper-container" id="topNav" style="position: fixed">
            <div class="swiper-wrapper">
                <div class="swiper-slide active" stateValue="" id="isDate"><span>综合</span><img class="synthesize"
                                                                            src="../phoneImg/synthesize_sort_act.jpg"
                                                                            alt="" id="synthesize_img"></div>
                <div class="swiper-slide" stateValue="4" id="isSales"><span>销量</span></div>
                <div class="swiper-slide" stateValue="5" id="isPrice" isPrice=""><span>价格</span><img class="price"
                                                                             src="../phoneImg/price_sort.jpg" alt="">
                </div>
                <!--<div id="offCanvasBtn" href="#offCanvasSide"  class="swiper-slide" stateValue="6"><span>筛选</span><img class="filtrate" src="../phoneImg/filtrate.jpg" alt=""></div>-->
            </div>
        </div>
        <div id="offCanvasContentScroll" class="mui-scroll-wrapper" style="padding-top: 89px;" >

            <!--<div class="mui-scroll">-->
                <!--<div class="mui-content-padded">-->
                    <div  class="mui-scroll">
                        <div class="filtrate_box" style="display: none">
                            <ul class="mui-clearfix">
                                <li>
                                    <div><span>品牌</span><img src="../phoneImg/synthesize_sort.jpg" alt=""></div>
                                </li>
                                <li class="filtrate_act">
                                    <div><span>指纹识别</span></div>
                                </li>
                                <li class="filtrate_act2">
                                    <div><span>网络制式</span><img src="../phoneImg/synthesize_sort.jpg" alt=""></div>
                                </li>
                                <li>
                                    <div><span>产品特点</span><img src="../phoneImg/synthesize_sort.jpg" alt=""></div>
                                </li>
                            </ul>
                            <div class="filtrate_detail_box" style="display: none;">
                                <ul class="mui-clearfix">
                                    <li class="detail_act">联通4G</li>
                                    <li>联通4G</li>
                                    <li>联通4G</li>
                                    <li>联通4G</li>
                                    <li>联通4G</li>
                                    <li>联通4G</li>
                                    <li>联通4G</li>
                                    <li>联通4G</li>
                                </ul>
                                <div class="filtrate_btn_box mui-clearfix">
                                    <div class="reset">重置</div>
                                    <div class="certain">确定</div>
                                </div>
                                <div class="shade_box"></div>
                            </div>
                        </div>

                        <!--列表结构-->
                        <div class="list_box mui-clearfix" style="display: none;">
                            <!--<div class="item_box">-->
                                <!--<div class="img"><img src="../phoneImg/goods.jpg" alt=""></div>-->
                                <!--<div class="goods">-->
                                    <!--<div class="title">iphone8 64GB 金色 移动联通电信4G手机移动联通电信4G手机</div>-->
                                    <!--<div class="tips"><span>64GB内存</span><span>1200万像素</span><span>A11处理器</span></div>-->
                                    <!--<div class="price"><b>￥</b>5480.00<span>分期购</span></div>-->
                                    <!--<div class="comment"><span>28390人评价</span><span>2908人咨询</span></div>-->
                                <!--</div>-->
                            <!--</div>-->
                        </div>

                        <!--一行两个-->
                        <div class="list_box2 mui-clearfix">
                            <!--<div class="item2_box">-->
                                <!--<div class="img"><img src="../phoneImg/goods.jpg" alt=""></div>-->
                                <!--<div class="goods">-->
                                    <!--<div class="title">iphone8 64GB 金色 移动联通电信4G手机移动联通电信4G手机</div>-->
                                    <!--<div class="tips"><span>64GB内存</span><span>1200万像素</span></div>-->
                                    <!--<div class="stages mui-clearfix"><span>分期购</span></div>-->
                                    <!--<div class="price"><b>￥</b>5480.00</div>-->
                                    <!--<div class="comment"><span>28390人评价</span><span>2908人咨询</span></div>-->
                                <!--</div>-->
                            <!--</div>-->
                        </div>

                    </div>


                <!--</div>-->
            <!--</div>-->
            <div class="spoor" id="spoor"><img src="../phoneImg/spoor.png" alt="我的足迹"></div>
        </div>
        <!-- off-canvas backdrop -->
        <div class="mui-off-canvas-backdrop"></div>
    </div>
<!--</div>-->

<script src="../js/mui.min.js"></script>
<script src="../js/jquery-1.10.1.min.js"></script>
<script>
    document.write("<s" + "cript type='text/javascript' src='../js/common.js?" + Math.random() + "'></scr" + "ipt>");
    document.write("<s" + "cript type='text/javascript' src='../phoneJs/goods_list.js?" + Math.random() + "'></scr" + "ipt>");
</script>

</body>

</html>